<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="my" uri="/mytags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta charset="UTF-8">
		<title>分管领导信息</title>
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/asserts/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
	
		<!-- js插件 -->
		<script src="${pageContext.request.contextPath}/js/jquery-3.2.1.min.js"></script>
		<script src="${pageContext.request.contextPath}/asserts/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
 	 
 	   <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/asserts/bootstrapValidate/css/bootstrapValidator.min.css"/>
 	   <script src="${pageContext.request.contextPath}/asserts/bootstrapValidate/js/bootstrapValidator.min.js"></script>
	</head>
	<body>
			<!-- 内容展示区 -->
			<div >
					<!-- 导航 -->
					<ol class="breadcrumb">
						<li><i class="fa fa-comment"></i> 分管领导管理</li>
					</ol>
					<div class="container-fluid">
						<!-- 	内容面板 -->
						<div class="panel panel-default">
							<!-- 控制按钮 -->
							<div class="panel-heading">
									<div class="btn-group">
										<button class="btn btn-primary" data-toggle="modal" data-target="#myaddmodal"><span class="glyphicon glyphicon-pencil"></span>添加</button>
									</div>
							</div><!-- 控制按钮  end-->
							<div class="panel-body">
								<table class="table table-bordered table-striped table-condensed table-hover">
									<tr>
										<th width="5%"><input type="checkbox" name="" id="selectAll" /></th>
										<th width="5%">ID</th>
										<th width="30%">领导名称</th>
										<th width="10%">领导电话</th>
										<th width="10%">QQ</th>
										<th width="30%">操作</th>
									</tr>
									<!-- 数据绑定 -->
								<c:forEach items="${pageInfo.list}" var="leader">
									<tr>
										<td><input type="checkbox" name="" class="eid" id="" /></td>
										<td>${leader.id}</td>
										<td>${leader.name}</td>
										<td>${leader.phone}</td>
										<td>${leader.qq}</td>
										<td>
											<button type="button" class="btn btn-primary" 
												data-toggle="modal" data-target="#mymodal" onclick="update(this)" >
												 <span class="glyphicon glyphicon-edit"></span> 修改</button>
											 <button type="button" class="btn btn-danger" onclick="del(${leader.id})"> 
											 	<span class="glyphicon glyphicon-remove"></span> 删除</button>
										 </td>
									</tr>
								</c:forEach>		 
										
									<!-- 	数据绑定 end -->
								</table>
								<!-- 	分页 -->
									<!-- <nav class="text-center">
									<ul class="pagination pagination-sm">
										<li class="disabled"><a href="javascript:void(0)">&laquo;</a></li>
										<li class="active"><a href="">1</a></li>
										<li><a href="">2</a></li>
										<li><a href="">3</a></li>
										<li><a href="">...</a></li>
										<li><a href="">49</a></li>
										<li><a href="">50</a></li>
										<li><a href="">&raquo;</a></li>
									</ul>
									</nav> -->
				<my:page prePage="${pageInfo.prePage}" nextPage="${pageInfo.nextPage}"
				 url="${pageContext.request.contextPath}/leader/list?n=1" totalPage="${pageInfo.pages }" currentPage="${pageInfo.pageNum}"/>
							</div>
						</div><!-- 内容面板 end -->
					</div>
			</div><!-- 	内容展示区 end-->
	 
		
		<!-- 弹层组件 添加标签 -->
		<div class="modal fade" id="mymodal">
			<div class="modal-dialog">
				<div class="modal-content">
					<form action="${pageContext.request.contextPath}/leader/update"  class="form-horizontal">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
							<h4 class="modal-title" id="mylabel">修改分管领导信息</h4>
						</div>
						<div class="modal-body">
							  <input type="hidden" id="id1" name="id" class="form-control"  />
							  <!-- 学校-->
								<div class="form-group">
									<label class="control-label col-md-3">领导姓名：</label>
									<div class="col-md-8">
										<input type="text" id="name1" name="name" placeholder="请输入姓名" class="form-control"  />
									</div>
								</div>
								  <!-- 电话-->
								<div class="form-group">
									<label class="control-label col-md-3">电话：</label>
									<div class="col-md-8">
										<input type="text" id="phone1" name="phone" placeholder="请输入电话" class="form-control"  />
									</div>
								</div>
								<!-- QQ：
                                -->
								<div class="form-group">
									<label class="control-label col-md-3">QQ：</label>
									<div class="col-md-8">
										<input type="text" id="qq1" name="qq" placeholder="请输入QQ" class="form-control"  />
									</div>
								</div>
							 
								 
						</div>
						<div class="modal-footer">
							<button class="btn btn-danger" type="reset">重置</button>
							<button class="btn btn-primary" type="submit">录入</button>
						</div>
					</form>
				</div>
			</div>
		</div><!-- 弹层组件 添加标签 end -->
		<!-- 添加   弹层组件 添加标签 -->
		<div class="modal fade" id="myaddmodal">
			<div class="modal-dialog">
				<div class="modal-content">
					<form action="${pageContext.request.contextPath}/leader/add"  class="form-horizontal">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
							<h4 class="modal-title" id="mylabel">录入分管领导信息</h4>
						</div>
						<div class="modal-body">
							  
							  <!-- 学校-->
								<div class="form-group">
									<label class="control-label col-md-3">领导姓名：</label>
									<div class="col-md-8">
										<input type="text" name="name" placeholder="请输入姓名" class="form-control"  />
									</div>
								</div>
								  <!-- 电话-->
								<div class="form-group">
									<label class="control-label col-md-3">电话：</label>
									<div class="col-md-8">
										<input type="text" name="phone" placeholder="请输入电话" class="form-control"  />
									</div>
								</div>
								<!-- QQ：
                                -->
								<div class="form-group">
									<label class="control-label col-md-3">QQ：</label>
									<div class="col-md-8">
										<input type="text" name="qq" placeholder="请输入QQ" class="form-control"  />
									</div>
								</div>
							 
								 
						</div>
						<div class="modal-footer">
							<button class="btn btn-danger" type="reset">重置</button>
							<button class="btn btn-primary" type="submit">录入</button>
						</div>
					</form>
				</div>
			</div>
		</div><!-- 弹层组件 添加标签 end -->
	 
	</body>
<script>
	 $(function () {
	  
        $('form').bootstrapValidator({
　　　　　　　　message: 'This value is not valid',
            　feedbackIcons: {
                　　　　　　　　valid: 'glyphicon glyphicon-ok',
                　　　　　　　　invalid: 'glyphicon glyphicon-remove',
                　　　　　　　　validating: 'glyphicon glyphicon-refresh'
            　　　　　　　　   },
            fields: {
                name: {
                    message: '用户名验证失败',
                    validators: {
                        notEmpty: {
                            message: '姓名不能为空'
                        }
                    }
                },
                phone: {
                    validators: {
                        notEmpty: {
                            message: '电话不能为空'
                        }
                    }
                },
                qq: {
                    validators: {
                        notEmpty: {
                            message: 'QQ不能为空'
                        }
                    }
                }
            } ,
            submitHandler: function (validator, form, submitButton) {
              // alert("submit");
            }
        });
    });
	 

     function del(id){
  	  var flag =  confirm("确认是否删除？");
  	   if(flag){
  		   var path  ='${pageContext.request.contextPath}';
  		   //alert(id);
  		    location.href= path+"/leader/delete/"+id;
  	   }
     }
     function update(obj){/*点击修改按钮，给模态框加载信息并且弹出模态框*/
         var tds= $(obj).parent().parent().find('td');
         $("#id1").val(tds.eq(1).text());
  		  $("#name1").val(tds.eq(2).text());
  		  $("#phone1").val(tds.eq(3).text());
  		  $("#qq1").val(tds.eq(4).text());
  		  
  	   }
	
</script>
</html>